<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>Hello MUI</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../css/mui.min.css">
		<link rel="stylesheet" href="../css/prewimg.css">
		<link href="../css/iconfontt.css" rel="stylesheet" />
		<style type="text/css">
			html,
			body {
				width: 100%;
				background-color: #efeff4;
			}
			
			span.mui-icon {
				font-size: 14px;
				color: #007aff;
				margin-left: -15px;
				padding-right: 10px;
			}
			
			.mui-off-canvas-right {
				color: #fff;
			}
			
			.title {
				margin: 35px 15px 10px;
			}
			
			.title+.content {
				margin: 10px 15px 35px;
				color: #bbb;
				text-indent: 1em;
				font-size: 14px;
				line-height: 24px;
			}
			
			input {
				color: #000;
			}
			
			.bg-color {
				background-color: #3B559F;
				box-shadow: none;
			}
			
			.bg-color div {
				font-size: 80%;
				color: #FFFFFF;
				margin-left: 1%;
				margin-top: 3.6%;
			}
			
			.dingwei-png {
				width: 16px;
				height: 16px;
			}
			
			.bg-color .add-png {
				width: 7%;
				float: right;
			}
			
			.mui-bar~.mui-content .mui-fullscreen {
				top: 44px;
				height: auto;
			}
			
			.mui-pull-top-tips {
				position: absolute;
				top: -20px;
				left: 50%;
				margin-left: -25px;
				width: 30px;
				height: 30px;
				border-radius: 100%;
				z-index: 1;
			}
			
			.mui-bar~.mui-pull-top-tips {
				top: 24px;
			}
			
			.mui-pull-top-wrapper {
				width: 32px;
				height: 32px;
				display: block;
				text-align: center;
				background-color: #efeff4;
				border: 1px solid #ddd;
				border-radius: 25px;
				background-clip: padding-box;
				box-shadow: 0 4px 10px #bbb;
			}
			
			.mui-pull-top-tips.mui-transitioning {
				-webkit-transition-duration: 200ms;
				transition-duration: 200ms;
			}
			
			.mui-pull-top-tips .mui-pull-loading {
				/*-webkit-backface-visibility: hidden;
				-webkit-transition-duration: 400ms;
				transition-duration: 400ms;*/
				margin: 0;
			}
			
			.mui-pull-top-wrapper .mui-icon,
			.mui-pull-top-wrapper .mui-spinner {
				margin-top: 7px;
			}
			
			.mui-pull-top-wrapper .mui-icon.mui-reverse {
				-webkit-transform: rotate(180deg) translateZ(0);
			}
			
			.mui-pull-bottom-tips {
				text-align: center;
				background-color: #efeff4;
				font-size: 15px;
				line-height: 30px;
				color: #777;
			}
			
			.mui-pull-top-canvas {
				overflow: hidden;
				background-color: #fafafa;
				border-radius: 40px;
				box-shadow: 0 4px 10px #bbb;
				width: 30px;
				height: 30px;
				margin: 0 auto;
			}
			
			.mui-pull-top-canvas canvas {
				width: 30px;
			}
			
			.mui-pull-left {
				color: #FFFFFF;
			}
			
			.mui-control-item {
				width: 25%!important;
			}
			
			@keyframes myfirst {
				0% {
					transform: translate(0px, 0px);
				}
				50% {
					transform: translate(0px, -10px);
				}
				100% {
					transform: translate(0px, 0px);
				}
			}
			
			.mui-slider-progress-bar {
				width: 33.33%!important;
			}
			
			.mui-table-view {
				list-style-image: none!important;
				background-color: #F7F7F7;
			}
			
			.mui-card {
				background-color: white;
				width: 100%;
				margin-left: 0;
				height: auto;
				margin-top: 0;
				box-shadow: none;
				background-clip: padding-box!important;
			}
			
			.mui-card .imggg {
				width: 34px!important;
				width: 34px!important;
			}
			
			.follow-div {
				float: right;
				right: 0;
				padding: 4px 13px;
				border: 1px solid #3A96FC;
				border-radius: 2px;
				color: #3A96FC;
			}
			
			.mui-card-header {
				border: 0!important;
			}
			
			.mui-media-body span {
				font-size: 95%;
			}
			
			.mui-media-body text {
				font-size: 80%;
				color: #A7A5A5;
			}
			
			.area-div {
				display: flex;
				margin-left: 3%;
				color: #A7A5A5;
				font-size: 80%;
				margin-right: 3.5%;
				padding: 0;
			}
			
			.area-div .area-img {
				width: 4%!important;
				height: 4%!important;
				position: relative;
				margin-top: 3px;
			}
			
			.write-div {
				width: 91%;
				font-size: 90%;
				z-index: 99;
				margin-left: 3.5%;
				padding-bottom: 1%;
			}
			
			.mui-cardfooter {
				display: flex;
				justify-content: center;
				align-items: center;
				flex-wrap: wrap;
				font-size: 130%;
				padding: 5px 0;
				margin: 0;
				color: #000000;
				box-shadow: none;
				border-top: 1px solid #F5F5F5;
			}
			
			.foot-cont {
				width: 33.3333%;
			}
			
			.foot-cont text {
				display: none;
			}
			
			.commentcont text {
				display: none;
			}
			
			#imgcontent {
				width: 100%;
				padding-left: 3.5%;
				display: flex;
				flex-wrap: wrap;
				margin-bottom: 4px;
			}
			
			#imgcontent1 {
				width: 100%;
				padding-left: 3.5%;
				display: flex;
				flex-wrap: wrap;
				margin-bottom: 4px;
			}
			
			.imgarea {
				overflow: hidden;
				background-color: aqua;
				border-radius: 2px;
				list-style: none;
			}
			
			.imgarea img {
				margin-bottom: 0;
			}
			
			.mui-card-footer-bar {
				display: flex;
				justify-content: center;
				align-items: center;
			}
			
			.mui-card-footer-bar span {
				margin-left: 3%;
			}
			
			.footer-num {
				font-size: 70%;
			}
			
			.bottom-png {
				width: 15%!important;
			}
			
			.nodong-div {
				width: 100%;
				display: flex;
				flex-wrap: wrap;
				justify-content: center;
				padding: 20% 0;
				background-color: white;
				margin-top: 3%;
			}
			
			.img-div {
				width: 100%;
			}
			
			.img-png {
				width: 26%;
				margin-left: 37%;
			}
			
			.btn-div {
				width: auto;
				display: flex;
				justify-content: center;
				align-items: center;
				background-color: #1484FE;
				font-size: 80%;
				margin-bottom: 0;
				width: 40%;
				padding: 2% 0;
				border-radius: 4px;
				margin-top: 3%;
			}
			
			.btn-div span {
				margin-top: 1%;
				color: #FFFFFF;
				margin-left: 2%;
			}
			
			.fiends-div {
				width: 100%;
				background-color: #FFFFFF;
				border-bottom: 1px solid #F7F7F7;
				display: flex;
				flex-wrap: wrap;
				padding: 2% 0;
			}
			
			.friend-heddimg {
				width: 12%;
				margin-right: 3%;
				margin-left: 3%;
			}
			
			.card-div {
				display: none;
			}
			
			.text-div {
				margin-top: 2px;
			}
			
			.text-div text {
				display: block;
			}
			
			.p-text {
				font-size: 80%;
				margin-bottom: 0;
			}
			
			.mui-slider-item {
				border: 0!important;
				width: 100%;
				height: 100%;
				list-style: none!important;
			}
		</style>
	</head>

	<body>

		<!--侧滑菜单容器-->
		<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable">
			<!--菜单部分-->
			<aside id="offCanvasSide" class="mui-off-canvas-right">
				<div id="offCanvasSideScroll" class="mui-scroll-wrapper">
					<div class="mui-scroll">
						<div class="title">温馨提示</div>
						<div class="content">
							这是可拖动式侧滑菜单示例，你可以在这里放置任何内容；关闭侧滑菜单有多种方式： 1.在手机屏幕任意位置向右拖动(drag)；2.点击本侧滑菜单页之外的任意位置; 3.点击如下红色按钮
							<span class="android-only">；4.Android手机按back键；5.Android手机按menu键
							</span>。
							<p style="margin: 10px 15px;">
								<button id="offCanvasHide" type="button" class="mui-btn mui-btn-danger mui-btn-block" style="padding: 5px 20px;background-color: dodgerblue;border: 0;">关闭侧滑菜单</button>
							</p>

						</div>
						<div class="title" style="margin-bottom: 25px;">其他功能</div>
						<ul class="mui-table-view mui-table-view-chevron mui-table-view-inverted" style="background-color: #333333;">
							<li class="mui-table-view-cell" id="choseschool">
								<a class="mui-navigate-right">
									选择学校
								</a>
							</li>
							<li class="mui-table-view-cell" id="fadongtai">
								<a class="mui-navigate-right">
									发布动态
								</a>
							</li>
							<li class="mui-table-view-cell" id="lostget">
								<a class="mui-navigate-right">
									失物招领
								</a>
							</li>

						</ul>
					</div>
				</div>
			</aside>
			<div class="mui-inner-wrap" id="showitem">
				<header class="mui-bar bg-color mui-bar-nav" id="header">
					<a class="mui-pull-left" id="a-text">动态</a>
					<img src="../images/menus.png" class="add-png" id="offCanvasShow">
				</header>
				<div class="mui-content mui-scroll-wrapper" id="offCanvasContentScroll">
					<div id="slider" class="mui-slider mui-fullscreen">
						<div id="sliderSegmentedControl" class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
							<a class="mui-control-item" href="#item1mobile" style="">
								<span class="iconfont icon-xinwendongtai" style="margin-right: 5%;"></span>我的校友

							</a>
							<a class="mui-control-item mui-active" href="#item2mobile">
								<span class="iconfont icon-gerenkongjiandongtai" style="margin-right: 5%;"></span>校园墙
							</a>
							<a class="mui-control-item" href="#item3mobile">
								<span class="iconfont icon-wodedongtai"></span>好友墙
							</a>
						</div>
						<div id="sliderProgressBar" class="mui-slider-progress-bar mui-col-xs-4" style="margin-top: -1px;z-index: 99;position: relative;"></div>
						<div class="mui-slider-group">
							<div id="item1mobile" class="mui-slider-item mui-control-content">
								<div id="scroll1" class="mui-scroll-wrapper">
									<div class="mui-scroll">
										<ul class="mui-table-view" id="ulcontent1"></ul>
									</div>
								</div>
							</div>
							<div id="item2mobile" class="mui-slider-item mui-control-content mui-active">
								<div class="mui-scroll-wrapper">
									<div class="mui-scroll">
										<ul class="mui-table-view" id="ulcontent2"></ul>
									</div>
								</div>
							</div>
							<div id="item3mobile" class="mui-slider-item mui-control-content">
								<div class="mui-scroll-wrapper">
									<div class="mui-scroll">
										<ul class="mui-table-view" id="ulcontent3"></ul>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="mui-off-canvas-backdrop"></div>
			</div>
		</div>
		<script src="../js/mui.min.js"></script>
		<script src="../js/mui.pullToRefresh.js"></script>
		<script src="../js/mui.pullToRefresh.material.js"></script>
		<script src="../js/immersed.js"></script>
		<script src="../js/mui.zoom.js"></script>
		<script src="../js/mui.previewimage.js"></script>
		<script src="../js/arttmpl.js"></script>
		<script src="../js/app.min.js"></script>
		<script type="text/javascript">
			mui.previewImage(function(img) {
				plus.webview.currentWebview().setStyle({
					top: '0px',
					bottom: '0px'
				})
			}, function(img) {
				plus.webview.currentWebview().setStyle({
					top: '0px',
					bottom: '50px'
				})
			});
			mui.init({
				swipeBack: false,
			});
			//侧滑容器父节点
			var offCanvasWrapper = mui('#offCanvasWrapper');
			//主界面容器
			var offCanvasInner = offCanvasWrapper[0].querySelector('.mui-inner-wrap');
			//菜单容器
			var offCanvasSide = document.getElementById("offCanvasSide");
			//Android暂不支持整体移动动画
			if(!mui.os.android) {
				document.getElementById("move-togger").classList.remove('mui-hidden');
				var spans = document.querySelectorAll('.android-only');
				for(var i = 0, len = spans.length; i < len; i++) {
					spans[i].style.display = "none";
				}
			}

			document.getElementById('offCanvasShow').addEventListener('tap', function() {
				offCanvasWrapper.offCanvas('show');
			});
			document.getElementById('offCanvasHide').addEventListener('tap', function() {
				offCanvasWrapper.offCanvas('close');
			});
			//主界面和侧滑菜单界面均支持区域滚动；
			mui('#offCanvasSideScroll').scroll();
			mui('#offCanvasContentScroll').scroll();
			//实现ios平台的侧滑关闭页面；
			if(mui.os.plus && mui.os.ios) {
				offCanvasWrapper[0].addEventListener('shown', function(e) { //菜单显示完成事件
					plus.webview.currentWebview().setStyle({
						'popGesture': 'none'
					});
				});
				offCanvasWrapper[0].addEventListener('hidden', function(e) { //菜单关闭完成事件
					plus.webview.currentWebview().setStyle({
						'popGesture': 'close'
					});
				});
			}
			var schoolnum = 0;
			var goodfriendnum = 0;
			var schoolfriendnum = 0;
			//阻尼系数
			var deceleration = mui.os.ios ? 0.003 : 0.0009;
			mui('.mui-scroll-wrapper').scroll({
				bounce: false,
				indicators: false, //是否显示滚动条
				deceleration: deceleration
			});
			mui.ready(function() {
				
				//循环初始化所有下拉刷新，上拉加载。
				mui.each(document.querySelectorAll('.mui-slider-group .mui-scroll'), function(index, pullRefreshEl) {
					mui(pullRefreshEl).pullToRefresh({
						down: {
							callback: function() {
								var self = this;
								setTimeout(function() {
									if(index == 0){
										schoolfriendnum = 1;	
										myschoolfiends(schoolfriendnum)
									}else if(index == 1){										
										schoolnum = 1;
										schoolwall(schoolnum);
									}else{
										goodfriendnum = 1;
										goodfriendwall(goodfriendnum);
									}
									self.endPullDownToRefresh();
								}, 1000);
							}
						},
						up: {
							callback: function() {
								var self = this;
								setTimeout(function() {									
									if(index == 0){
										schoolfriendnum ++;	
										myschoolfiends(schoolfriendnum)
									}else if(index == 1){										
										schoolnum ++;
										schoolwall(schoolnum);
									}else{
										goodfriendnum ++;
										goodfriendwall(goodfriendnum);
									}
									self.endPullUpToRefresh();
								}, 1000);
							}
						}
					});
				});
			});
			
			
			var alllistcontent = function(cont, index, numm) {
				var record = cont;
				for(var g = 0; g < record.length; g++) {
					if(record[g].lydongtai_Img) {
						var a = '';
						a = record[g].lydongtai_Img.split(',');
						record[g].lydongtai_Img = a;
					} else {
						record[g].lydongtai_Img = '';
					}
					if(record[g].lydongtai_Whb) {
						var b = '';
						b = record[g].lydongtai_Whb.split(',');
						record[g].lydongtai_Whb = b;
					} else {
						record[g].lydongtai_Whb = '';
					}
				}

				//利用图灵接口演示聊天布局 
				//追加模板消息
				var id = "ulcontent" + index;
				if(index == 2) {
					var str = template('schoolfriend-card', {
						"record": record
					});
					if(numm == 1){
						document.getElementById(id).innerHTML = str;
					}else{
						document.getElementById(id).innerHTML += str;
					}
					var imgas = document.getElementsByClassName("imgcontent");				
				} else {
					var str = template('goodfriend-card', {
						"record": record
					});
					if(numm == 1){
						document.getElementById(id).innerHTML = str;
					}else{
						document.getElementById(id).innerHTML += str;
					}
					var imgas = document.getElementsByClassName("imgcontent1");
				}
				var viewwidth = document.body.clientWidth;
				var ifguanzhudiv = document.getElementsByClassName('follow-div');
				console.log(imgas.length+"---"+ numm);
				var k = 0;
				for(var i = (numm - 1) * 15; i < imgas.length; i++) {	
					
					//关注事件
//					var ta_card = ifguanzhudiv[i].getElementsByTagName('span');
//					mui.ajax('https://www.lunyuwang.com/homeController/judjeFriendOrFollow', {
//						data: {
//							lyuser_Card: plus.storage.getItem("card"),
//							lyuser_SmBody: ta_card[0].textContent
//						},
//						crossDomain: true, //强制使用5+跨域
//						dataType: 'json', //服务器返回json格式数据
//						type: 'get', //HTTP请求类型
//						timeout: 10000, //超时时间设置为10秒；
//						//processData: false,
//						headers: {
//							'Content-Type': 'application/x-www-form-urlencoded'
//						},
//						success: function(data) {
//							var flag = data.state;
//							console.log(ta_card[0].textContent+'-----------------------------');
////							if(flag == 4){//自己
////								ifguanzhudiv[i].style.display = 'none'}
//////							else if(flag == 1){//好友
//////								
//////							}else if(flag == 2){//已关注，不是好友
//////								
//////							}else{//没关注，也不是好友
//////								
//////							}
//						}
//					})
					if(record[k].lydongtai_Img.length >= 3) {
						for(var j = 0; j < record[k].lydongtai_Img.length; j++) {
							var divimg = imgas[i].getElementsByTagName("li")[j];
							var imgarray = imgas[i].getElementsByTagName("img")[j];
							var immmg = divimg.getElementsByClassName('immggs')[0];
							realbi = record[k].lydongtai_Whb[j];
							divimg.style.cssText = "width: 31%;height: -webkit-calc(" + viewwidth * 0.31 + "px);margin: 0.5% -webkit-calc(" + viewwidth * 0.005 + "px)";
							if(realbi >= 1) {
								var num = viewwidth * 0.31 * 0.5 * (realbi - 1);
								immmg.style.cssText = "width: -webkit-calc(" + viewwidth * 0.31 * realbi + "px);height: 100%;margin-left: -webkit-calc(" + (-num) + "px);";
								imgarray.style.cssText = "width: -webkit-calc(" + viewwidth * 0.31 * realbi + "px);height: 100%;";
							} else {
								var num = (viewwidth * 0.31 / realbi - viewwidth * 0.31) / 2;
								immmg.style.cssText = "width: 100%;height: -webkit-calc(" + viewwidth * 0.31 / realbi + "px);margin-top: -webkit-calc(" + (-num) + "px);"
								imgarray.style.cssText = "width: 100%;height: -webkit-calc(" + viewwidth * 0.31 / realbi + "px)";
							}
						}
						k ++;
					} else if(record[k].lydongtai_Img.length == 1) {
						var divimg = imgas[i].getElementsByTagName("li")[0];
						var imgarray = imgas[i].getElementsByTagName("img")[0];
						var immmg = divimg.getElementsByClassName('immggs')[0];
						realbi = record[k].lydongtai_Whb[0];
						console.log(realbi);
						if(realbi >= 1) {
							divimg.style.cssText = "width: 60%;max-height: -webkit-calc(" + viewwidth * 0.9 + "px);height: -webkit-calc(" + viewwidth * 0.6 / realbi + "px);margin: 0.5% -webkit-calc(" + viewwidth * 0.005 + "px)";
							immmg.style.cssText = "width: 100%;height: -webkit-calc(" + viewwidth * 0.6 / realbi + "px);";
							imgarray.style.cssText = "width: 100%;height: -webkit-calc(" + viewwidth * 0.6 / realbi + "px);";
						} else {
							divimg.style.cssText = "width: 66%;max-height: -webkit-calc(" + viewwidth + "px);height: -webkit-calc(" + viewwidth * 0.66 / realbi + "px);margin: 0.5% -webkit-calc(" + viewwidth * 0.005 + "px)";
							immmg.style.cssText = "width: 100%;height: -webkit-calc(" + viewwidth * 0.66 / realbi + "px);";
							imgarray.style.cssText = "width: 100%;height: -webkit-calc(" + viewwidth * 0.66 / realbi + "px);";
						}
						k ++;
					} else if(record[k].lydongtai_Img.length == 2) {
						for(var j = 0; j < record[k].lydongtai_Img.length; j++) {
							var divimg = imgas[i].getElementsByTagName("li")[j];
							var imgarray = imgas[i].getElementsByTagName("img")[j];
							var immmg = divimg.getElementsByClassName('immggs')[0];
							realbi = record[k].lydongtai_Whb[j];
							divimg.style.cssText = "width: 38%;height: -webkit-calc(" + viewwidth * 0.36 + "px);margin: 0.5% -webkit-calc(" + viewwidth * 0.005 + "px)";
							if(realbi >= 1) {
								var num = (viewwidth * 0.36 - viewwidth * 0.38 * realbi) / 2;
								immmg.style.cssText = "width: -webkit-calc(" + viewwidth * 0.38 * realbi + "px);height: 100%;margin-left: -webkit-calc(" + num + "px);"
								imgarray.style.cssText = "width: -webkit-calc(" + viewwidth * 0.38 * realbi + "px);height: 100%;";
							} else {
								var num = (viewwidth * 0.38 / realbi - viewwidth * 0.36) / 2;
								immmg.style.cssText = "width: 100%;height: -webkit-calc(" + viewwidth * 0.38 / realbi + "px);margin-top: -webkit-calc(" + (-num) + "px);"
								imgarray.style.cssText = "width: 100%;height: -webkit-calc(" + viewwidth * 0.38 / realbi + "px);"
							}
						}
						k ++;
					} else {
						console.log('11111111');
						k ++;
					}

				}
			}
			var showtoschool = true;
			var schoolwall = function(num) {
				mui.ajax('https://www.lunyuwang.com/homeController/queryDongTai', {
					data: {
						lyuser_Card: plus.storage.getItem("card"),
						pageNumm: num
					},
					crossDomain: true, //强制使用5+跨域
					dataType: 'json', //服务器返回json格式数据
					type: 'get', //HTTP请求类型
					timeout: 10000, //超时时间设置为10秒；
					//processData: false,
					headers: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					success: function(data) {						
						if((data.state == 0 || showtoschool == false) && num != 1){
							return ;
						}else if(data.dongTaiList.length == 1 || data.dongTaiList.length == 2){
							showtoschool = false;
							alllistcontent(data.dongTaiList , 2 , num);
						}else if(num == 1 || data.state != 0){
							showtoschool = true;
							alllistcontent(data.dongTaiList , 2 , num);
						}						
						plus.nativeUI.closeWaiting();
					}
				})
			}

			var goodfriendwall = function(num) {
				mui.ajax('https://www.lunyuwang.com/homeController/queryGoodFriend', {
					data: {
						lyuser_Card: plus.storage.getItem("card"),
						pageNumm: num
					},
					crossDomain: true, //强制使用5+跨域
					dataType: 'json', //服务器返回json格式数据
					type: 'get', //HTTP请求类型
					timeout: 10000, //超时时间设置为10秒；
					//processData: false,
					headers: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					success: function(data) {
						if(data.friendDongtais != '0'){
							alllistcontent(data.friendDongtais, 3 ,num);
						}						
					}
				})
			}

			var myschoolfiends = function(num) {
				mui.ajax('https://www.lunyuwang.com/homeController/queryCollageFriend', {
					data: {
						lyuser_Card: plus.storage.getItem("card"),
						pageNumm: num
					},
					crossDomain: true, //强制使用5+跨域
					dataType: 'json', //服务器返回json格式数据
					type: 'get', //HTTP请求类型
					timeout: 10000, //超时时间设置为10秒；
					//processData: false,
					headers: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					success: function(data) {
						var all_cont = data.collageFriendList;
						console.log(JSON.stringify(data.collageFriendList));
						var str = template('list-schoolfriend', {
							"all_cont": all_cont
						});
						if(all_cont == '0'){
							return ;
						}else if(num == 1){
							document.getElementById('ulcontent1').innerHTML = str;
						}else{
							document.getElementById('ulcontent1').innerHTML += str;
						}
						
						var viewwidth = document.body.clientWidth;
						var headimg = document.getElementsByClassName('fiends-div');
						for(var i = 0; i < headimg.length; i++) {
							headimg[i].getElementsByTagName('img')[0].style.height = "-webkit-calc(" + viewwidth * 0.12 + "px)";
						}
						plus.nativeUI.closeWaiting();
					}
				})
			}

			mui.plusReady(function() {
				document.getElementById('a-text').style.marginTop = (immersed / 2) + 'px';
				document.getElementById('offCanvasShow').style.marginTop = (immersed / 2.5) + 'px';
				schoolnum = 1;
				goodfriendnum = 1;
				schoolfriendnum = 1;
				schoolwall(schoolnum);
				goodfriendwall(goodfriendnum);
				myschoolfiends(schoolfriendnum);
//				//用a,b,c来控制访问后台次数，仅一次
//				var a = 0;
//				var b = 0;
//				document.getElementById('slider').addEventListener('slide', function(e) {
//					if(e.detail.slideNumber == 2 && b == 0) {
//						b++;
//						goodfriendwall(1);
//					} else if(e.detail.slideNumber != 1 && e.detail.slideNumber != 2 && a == 0) {
//						a++;
//						myschoolfiends(1);
//					}
//				});
				
				mui('.mui-table-view').on('tap','.licont',function(){
					mui.openWindow({
						url: "schoolfriendhtml.html",
						id: "schoolfriendhtml.html",
						extras: {
							card: this.getElementsByTagName('span')[0].textContent
						}
					})
				})
				
				var ifclick = false;
				mui(document).on('tap','.clickzan',function(){
					if(ifclick == false){
						this.getElementsByTagName('img')[0].src = "../images/afterzan.png";
						this.getElementsByTagName('span')[0].style.color = "#007AFF";
						this.getElementsByTagName('span')[0].textContent = parseInt(this.getElementsByTagName('span')[0].textContent) + 1;
						ifclick = true;
					}else{
						this.getElementsByTagName('img')[0].src = "../images/zann.png";
						this.getElementsByTagName('span')[0].style.color = "#000000";
						this.getElementsByTagName('span')[0].textContent = parseInt(this.getElementsByTagName('span')[0].textContent) - 1;
						ifclick = false;
					}
					
				})
				
				mui('.mui-table-view').on('tap','.imggg',function(){
					var cardd = this.parentNode.children[1].textContent;
					mui.openWindow({
						url: "schoolfriendhtml.html",
						id: "schoolfriendhtml.html",
						extras: {
							card: cardd
						}
					})
				})
				
				//预览图片时下载文件到相册
				var imgsrc = '';
				mui(document.body).on('tap', 'img[data-preview-src]', function() {
					imgsrc = this.src;
				})

				document.getElementById('downloadbtn').addEventListener('tap', function() {
					var btnArray = ['保存', '取消'];
					mui.confirm('是否保存图片？', '保存图片到相册', btnArray, function(e) {
						if(e.index == 0) {
							var timestamp = (new Date()).valueOf();
							var downLoader = plus.downloader.createDownload(imgsrc, {
								method: 'GET'
							}, function(download, status) {
								var fileName = download.filename;
								//保存至本地相册
								plus.gallery.save(fileName, function() {
									mui.toast("保存成功");

								});
							});
							//开始下载任务
							downLoader.start();
						}
					})
				})
				
				document.getElementById("fadongtai").addEventListener('tap',function(){
					mui.openWindow({
						url: "shouyefdt.html",
						id: "shouyefdt.html"
					})
					offCanvasWrapper.offCanvas('close');
				})
				
				document.getElementById("choseschool").addEventListener('tap',function(){
					mui.openWindow({
						url: "searchschool.html",
						id: "searchschool.html"
					})
					offCanvasWrapper.offCanvas('close');
				})
				
				document.getElementById("lostget").addEventListener('tap',function(){
//					alert('失物招领!');
					offCanvasWrapper.offCanvas('close');
				})

			})
			
			window.addEventListener('reeefresh', function(e) { //执行刷新
				location.reload();
			});
			window.onload = function() {
				mui.plusReady(function() {
					mui(document).on('tap', '.deletedt', function() {
						mui.alert('转发');
					})					
				})
			}
		</script>

		<!--校园墙渲染模板-->
		<script type="text/template" id="schoolfriend-card">
			<% for(var i in record){ var item=record[i]; %>
			<li class="li-content">
				<p style="display: none;">
					<%=item.lydongtai_Id%>
				</p>
				<div class="mui-card">
					<div class="mui-card-header mui-card-media cardtop">
						<img src="<%=item.lyuser_FacePath%>" id="tigan<%=(i+1)%>" class="imggg" />
						<span style="display: none;"><%=item.lyuser_Card%></span>
						<div class="mui-media-body">
							<span id="name<%=(i+1)%>"><%=item.lyuser_NickName%></span>
							<div class="follow-div">
								<span style="display: none;"><%=item.lyuser_Card%></span>
								<span>关注</span>
							</div>
							<p id="time<%=(i+1)%>">
								<%=item.lydongtai_Time%>
							</p>
						</div>

					</div>
					<div id="write-div<%=(i+1)%>" class="write-div">
						<%=item.lydongtai_Text%>
					</div>
					<div class="mui-card-content" style="margin: 1% 0;">
						<ul id="imgcontent" class="imgcontent">
							<% for(var j in item.lydongtai_Img){ var res=item.lydongtai_Img[j]; %>
							<li class="imgarea">
								<div class="immggs"><img src="<%=res%>" id="<%=(i+1)%>" data-preview-src="" data-preview-group="<%=item.lydongtai_Id%>" class="immmg" /></div>
							</li>
							<% } %>
						</ul>
						<% if(item.lydongtai_Address) { %>
						<div class="area-div">
							<img src="../images/dwei.png" class="area-img" />
							<span id=""><%=item.lydongtai_Address%></span>
						</div>
						<% } %>
					</div>
					<div class="mui-cardfooter">
						<div class="foot-cont">
							<div class="mui-card-footer-bar clickzan"><img src="../images/zann.png" class="bottom-png" /><span class="footer-num"><%=item.lydongtai_Good%></span></div>
						</div>
						<div class="foot-cont comment">
							<div class="mui-card-footer-bar commentcont"><text><%=item.lydongtai_Id%></text><img src="../images/talk.png" class="bottom-png" /><span class="footer-num">评论</span></div>
						</div>
						<div class="delete-div foot-cont">
							<div class="mui-card-footer-bar deletedt">
								<img src="../images/forword.png" class="bottom-png pnggs" />
								<text><%=item.lydongtai_Id%></text>
								<text><%=item.lydongtai_Img.toString()%></text>
								<span class="footer-num">转发</span>
							</div>
						</div>
					</div>
				</div>
			</li>
			<% } %>
		</script>

		<!--好友墙渲染模板-->
		<script type="text/template" id="goodfriend-card">
			<% for(var i in record){ var item=record[i]; %>
			<li class="li-content">
				<p style="display: none;">
					<%=item.lydongtai_Id%>
				</p>
				<div class="mui-card">
					<div class="mui-card-header mui-card-media cardtop">
						<img src="<%=item.lyuser_FacePath%>" id="tigan<%=(i+1)%>" class="imggg" />
						<span style="display: none;"><%=item.lyuser_Card%></span>
						<div class="mui-media-body">
							<span id="name<%=(i+1)%>"><%=item.lyuser_NickName%></span>
							<p id="time<%=(i+1)%>">
								<%=item.lydongtai_Time%>
							</p>
						</div>
					</div>
					<div id="write-div<%=(i+1)%>" class="write-div">
						<%=item.lydongtai_Text%>
					</div>
					<div class="mui-card-content" style="margin: 1% 0;">
						<ul id="imgcontent1" class="imgcontent1">
							<% for(var j in item.lydongtai_Img){ var res=item.lydongtai_Img[j]; %>
							<li class="imgarea">
								<div class="immggs"><img src="<%=res%>" id="<%=(i+1)%>" data-preview-src="" data-preview-group="(<%=item.lydongtai_Id%>+100000000)" class="immmg" /></div>
							</li>
							<% } %>
						</ul>
						<% if(item.lydongtai_Address) { %>
						<div class="area-div">
							<img src="../images/dwei.png" class="area-img" />
							<span id=""><%=item.lydongtai_Address%></span>
						</div>
						<% } %>
					</div>
					<div class="mui-cardfooter">
						<div class="foot-cont">
							<div class="mui-card-footer-bar clickzan"><img src="../images/zann.png" class="bottom-png" /><span class="footer-num"><%=item.lydongtai_Good%></span></div>
						</div>
						<div class="foot-cont comment">
							<div class="mui-card-footer-bar commentcont"><text><%=item.lydongtai_Id%></text><img src="../images/talk.png" class="bottom-png" /><span class="footer-num">评论</span></div>
						</div>
						<div class="delete-div foot-cont">
							<div class="mui-card-footer-bar deletedt">
								<img src="../images/forword.png" class="bottom-png" />
								<text><%=item.lydongtai_Id%></text>
								<text><%=item.lydongtai_Img.toString()%></text>
								<span class="footer-num">转发</span>
							</div>
						</div>
					</div>
				</div>
			</li>
			<% } %>
		</script>

		<!--列表渲染模板-->
		<script type="text/template" id="list-schoolfriend">
			<% for(var i in all_cont){ var item=all_cont[i]; %>
			<li class="licont">
				<span style="display: none;"><%=item.lyuser_Card%></span>
				<div id="fiends-div<%=(i+1)%>" class="fiends-div">
					<text class="card-div"><%=item.lyuser_Card%></text>
					<text class="card-div"><%=item.lyuser_Id%></text>
					<img src="<%=item.lyuser_FacePath%>" class="friend-heddimg" />
					<div class="text-div">
						<text><%=item.lyuser_NickName%></text>
						<span class="p-text"><%=item.lyuser_Major%></span>
					</div>

				</div>
			</li>
			<% } %>
		</script>
	</body>

</html>